@import "public.less";
@import "button.less";

.cart-tab{
    text-align: center;
    background: #FFF;
    height: 39px;
    line-height: 39px;
//  border-bottom: 1px solid #ebebeb;
    .fontSize(28px);
    color: @cfont;
    .mui-active{
        color: @red;
        span{
            display: inline-block;
            padding:0 4px;
            line-height: 36px;
            border-bottom: 1px solid @red;
        }
    }
}
.mui-slider-group{
    position: absolute;
    top: 40px;
    bottom: 0;
    width: 100%;
    height: auto;
    .mui-slider-item{
        position: relative;
        width: 100%;
        height: 100%;
        vertical-align: top;
        white-space: normal;
    }
}

.mui-control-content .mui-loading {
    padding:50px 0;
}
.mui-pull-bottom-tips {
    text-align: center;
    background-color: #efeff4;
    font-size: 15px;
    line-height: 40px;
    color: #777;
}


.mui-table-view-cell{
    &.checkbox-list{ 
        padding: 0;
        &:after{
            background-color:#ebebeb;
            left: 0;
        }
        &.mui-active{
            background: transparent; 
        }
        span{
            padding-right: 10px;
            font-size: 24px/2;
            color: @red;
            line-height: 30px
        }
    }
    .mui-slider-handle{
        .mui-media-object{
            line-height: 70px;
            max-width: 200px;
            height: 70px;
        }
        .mui-media-body{
             white-space:normal;
            .name{
                .clump(1);
                overflow: hidden;
                .fontSize(29.63px);
                color: @cfont;
                line-height: 1.2;
            }
            p{
                .fontSize(24px);
                color: @cfont;
            }
            .price{
                text-align: right;
                .fontSize(28px);
                b{color: @red;}
            }
        }
    }
    &.product-list{
        padding-left: 10px;
        
        .mui-checkbox{
                margin-top: 17px;
        }
        .mui-checkbox.mui-left label{
            padding:10px 0 10px 18px;
        }
        .mui-checkbox.mui-left input[type=checkbox]{
            left: 0;
        }
        &:after{
            background: #ebebeb;
        }
    }
}


#scroll1 .mui-table-view{
    margin-top: 10px;
    
    &:first-child{
        margin-top: 0px;
    }
    &:before{
        background-color: @gray;
    }
    &:after{
        background-color: transparent;
    }
}
.mui-selected .mui-btn-red{
    background: @red;;
}


.cart-count{
    position: fixed;
    bottom: 0;
    left: 0;
    height: 50px;
    width: 100%;
    background: @white;
    border-top: 1px solid #ebebeb;
    z-index: 10001;
    .mui-pull-right{
        line-height: 50px;
        background: @red;
        color: @white;
        min-width: 30%;
        text-align: center;
        .fontSize(36px);
    }
    .count{
        text-align: right;
        line-height: 50px;
        span{
            padding-right: 10px;
            color:@cfont;
            .fontSize(36px);
        }
        .mui-checkbox.mui-left input[type=checkbox]{
            left: 10px;
            width: 19px;
            height: 19px;
            top:13px; 
            &:before{
                font-size: 19px;
            }
        }
        .mui-checkbox.mui-left label{
            padding-left: 35px;
            .fontSize(30px);
            color: @cfont;
        }
        .mui-checkbox input[type=checkbox]:checked:before{
            color: @red;
        }
    }
    
}


#collectView,#logView {
    .mui-table-view:after{
        background: transparent;
    }
    .mui-table-view-cell:after{
        background-color: #ebebeb;
        left: 0;
    }
    .mui-media-body{
        color: @cfont;
        .fontSize(29.63px);
    }
    .mui-media-object{
        line-height: 70px;
        max-width: 200px;
        height: 70px;
    }
    .money{
        color: @red;
        .fontSize(28px);
        font-weight: 700;
//      margin-top: 15px;
//      position: absolute;
//      bottom: 0px;
//      left: 0px;
        
    }
    .control{
        text-align: right;
         img{
            .wh2x(41px,41px);
        }
        button{
            padding: 3px 8px;
            &:first-child{
                margin-right: 5px;
            }
        }
    }
    .mui-checkbox{
            margin-top: 17px;
            display: none;
    }
    .mui-checkbox.mui-left label{
        padding:10px 0 10px 18px;
    }
    .mui-checkbox.mui-left input[type=checkbox]{
        left: 0;
    }
    
}


#cartStatus{
    display: none;
    height: 40px;
    line-height: 40px;
    padding:0 10px;
    font-size: 14px;
    color: #666;
    span{
        color: @red;
        font-size: 16px;
        margin-left: 20px;
    }
}
#refreshCart{
     color: @red;
    font-size: 15px;
    margin-left: 15px;
    display: block;
    margin:10px auto;
}


.mui-pull-top-tips {
                position: absolute;
                top: -20px;
                left: 50%;
                margin-left: -25px;
                width: 40px;
                height: 40px;
                border-radius: 100%;
                z-index: 11111;
            }
            .mui-bar~.mui-pull-top-tips {
                top: 24px;
            }
            .mui-pull-top-wrapper {
                width: 42px;
                height: 42px;
                display: block;
                text-align: center;
                background-color: #efeff4;
                border: 1px solid #ddd;
                border-radius: 25px;
                background-clip: padding-box;
                box-shadow: 0 4px 10px #bbb;
                overflow: hidden;
            }
            .mui-pull-top-tips.mui-transitioning {
                -webkit-transition-duration: 200ms;
                transition-duration: 200ms;
            }
            .mui-pull-top-tips .mui-pull-loading {
                /*-webkit-backface-visibility: hidden;
                -webkit-transition-duration: 400ms;
                transition-duration: 400ms;*/
                
                margin: 0;
            }
            .mui-pull-top-wrapper .mui-icon,
            .mui-pull-top-wrapper .mui-spinner {
                margin-top: 7px;
            }
            .mui-pull-top-wrapper .mui-icon.mui-reverse {
                /*-webkit-transform: rotate(180deg) translateZ(0);*/
            }
            .mui-pull-bottom-tips {
                text-align: center;
                background-color: #efeff4;
                font-size: 15px;
                line-height: 40px;
                color: #777;
            }
            .mui-pull-top-canvas {
                overflow: hidden;
                background-color: #fafafa;
                border-radius: 40px;
                box-shadow: 0 4px 10px #bbb;
                width: 40px;
                height: 40px;
                margin: 0 auto;
            }
            .mui-pull-top-canvas canvas {
                width: 40px;
            }
            .mui-slider-indicator.mui-segmented-control {
                background-color: #efeff4;
            }
            
.cainilike{
    margin-top: 10px;
    background: #FFF;
    .ts{
        margin-bottom: 10px;
        padding-left: 13px;
        padding-top: 10px;
    }
    .itemslink{
        padding:0 13px;   
        margin-bottom: 40px/2;
        img{
            width: 100%;
        }
        .name{
            .fontSize(28px);
            color: @cfont;
            padding: 0;
            margin: 0;
            line-height: 1;
            margin:3px 0 4px 0;
            .ell();
        }
        .price{
            color: @red;
            padding: 0;
            margin: 0;
            .fontSize(28px);
            line-height: 1;
        }
    }
}
